<template>
	<view style="background-color: #FEFEFE;">
		<view class="myzhanghu">我的账户</view>
		<view class="zhanghuyue">
			<view class="zhanghuyue-1">
				账户余额
			</view>
			<view class="zhanghuyue-2">
				{{balance}} 元
			</view>
			<view class="zhanghuyue-4">
				<u-button class="custom-style" text="提现"></u-button>
			</view>
		</view>
		<view class="jinrizhangdan">
			<u-row customStyle="margin-bottom: 10px" class="u-myGrid" style="overflow: hidden;margin-left: 8px;margin-top: 20px;">
				<u-grid :border="false" col="4" style="width: 360px;">
					<u-grid-item v-for="(listItem,listIndex) in listicon" :key="listIndex" style="width: 90px;">
						<u-image :customStyle="{paddingTop:10+'rpx'}" :src="listItem.name" width="50px" height="50px">
						</u-image>
						<text class="grid-text">{{listItem.title}}</text>
					</u-grid-item>
				</u-grid>
				<u-toast ref="uToast" />
			</u-row>
		</view>
		<view class="jinrizhangdans">
			<view class="jinrizhangdans1">今日账单</view>
			<view class="jinrizhangdans2">数据说明</view>
			<view class="jinrizhangdans3">
				<view style="margin-left: 30px;margin-top: 20px;">
					<view style="font-size: 18px;font-weight: 550;margin-top: 30px;margin-left: 120px;">+{{todayMoney}}</view>
					<view style="margin-top: 10px;font-size: 22px;margin-left: 70px;margin-top: 15px;">今日预计收入</view>
				</view>
			</view>
		</view>
		<view class="veiw-v" v-for="item in todayOrders" :key="item.id" v-show="dingdan">
			<view style="margin-top: 15px;font-size: 18px;">
				配送收入-{{item.takeOutNumber}}-{{item.shopAddress}}
			</view>
			<view style="color: #CDCDCD;font-size: 16px;margin-top: 10px;">
				{{item.updateTime}}
			</view>
			<view style="margin-top: -55px;font-size: 18px;float: right;">
				+{{item.distributionPrice}}
			</view>
			<view style="color: #CDCDCD;font-size: 16px;margin-top: -25px;float: right;">
				{{item.flag}}
			</view>
		</view>
		<view class="veiw-z" v-show="zanwudingdan">
				<img src="../../../static/内容为空.png" class="image"></img>
				<view style="font-size: 20px;margin-left: 120px;margin-top: 15px;">今日暂无订单</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id:'',//骑手对应用户ID
				balance:0,//账户余额
				todayMoney:0,//今日收入
				riderId:'',//骑手ID
				zanwudingdan:null,
				dingdan:null,
				todayOrders:[],//今日订单
				listicon: [{
						name: '../../../static/账户明细.jpg',
						title: '账户明细'
					},
					{
						name: '../../../static/年度盘点.jpg',
						title: '收支统计'
					},
					{
						name: '../../../static/账户明细.jpg',
						title: '保证金'
					},
					{
						name: '../../../static/年度盘点.jpg',
						title: '银行卡'
					},
				],
			}
		},
		onLoad(options) {
			this.id = options.riderId
			this.getRiderMoney()
		},
		methods: {
			getRiderMoney(){
				this.$myRequest({
					url:'/eat-service/rider/getRiderMoney',
					method:'get',
					data:{
						'userProtalId':this.id
					}
				}).then(res=>{
					this.balance = res.data.obj.balance
					this.todayMoney = res.data.obj.todayMoney
					this.riderId = res.data.obj.id
					this.getTodayOrder()
				})
			},
			getTodayOrder(){
				this.$myRequest({
					url:'/eat-service/commodityOrder/getTodayOrder',
					method:'get',
					data:{
						'riderId':this.riderId
					}
				}).then(res=>{
					this.todayOrders = res.data.obj
					if(this.todayOrders.length!=0){
						this.dingdan = true
						this.zanwudingdan = false
					}else{
						this.zanwudingdan = true
						this.dingdan = false
					}
				})
			}
		}
	}
</script>

<style>
	.image{
		width: 300px;
		height: 200px;
		margin-left: 40px;
	}
	.veiw-v{
		overflow: hidden;
		width: 370px;
		height: 80px;
		margin-left: 20px;
		margin-top: 10px;
		border-bottom: 3px solid #FAFAFA;
	}
	.veiw-z{
		overflow: hidden;
		width: 370px;
		height: 100%;
		margin-left: 20px;
		margin-top: 10px;
	}
	.jinrizhangdans3{
		width: 340px;
		margin-top: 10px;
		margin-left: 10px;
		height: 120px;
		border: 3px solid #FAFAFA;
		border-radius: 5px;
	}
	.jinrizhangdans1{
		font-size: 20px;
		margin-left: 4px;
		margin-top: 10px;
	}
	.jinrizhangdans2{
		font-size: 20px;
		margin-left: 274px;
		margin-top: -28px;
	}
	.jinrizhangdans{
		width: 370px;
		height: 180px;
		margin: 0 auto;
		overflow: hidden;
	}
	
	.jinrizhangdan {
		width: 370px;
		height: 130px;
		border-bottom: 4px solid #FAFAFA;
		margin: 0 auto;
		overflow: hidden;
	}

	.myzhanghu {
		font-size: 25px;
		font-weight: 500;
		margin-left: 20px;
		margin-top: 10px;
	}

	.zhanghuyue {
		width: 370px;
		height: 130px;
		background: #FDD54F;
		border-radius: 5px;
		border: 3px solid #E0D77C;
		margin-top: 20px;
		margin-left: 20px;
	}

	.zhanghuyue-1 {
		margin-left: 30px;
		margin-top: 30px;
	}

	.zhanghuyue-2 {
		font-size: 32px;
		font-weight: 700;
		margin-left: 30px;
		margin-top: 8px;
	}

	.zhanghuyue-3 {
		font-weight: 300px;
		font-size: 20px;
		margin-top: -30px;
	}

	.custom-style {
		font-weight: 600;
		color: white;
		border: 0px solid;
		width: 150rpx;
		background: #3D3F3E;
	}

	.zhanghuyue-4 {
		margin-left: 250px;
		margin-top: -33px;
	}
</style>
